<template>
	<view class="conter">
		
		<header-box :title="title"></header-box>
		
		
		<u-search placeholder="搜索地址..." v-model="keyword" :show-action="fasle"></u-search>
		
		<view class="conter-box1 flex-center" v-for="(item, index) in list" :key="index">
			<navigator :url="'/pages/site/hotelInfo?info=' + 1 +'&id=' + item.id " class="conter-box-image">
				<image :src="item.image" mode=""></image>
			</navigator>
			<!-- <view class="flex-box"> -->
				<view class="">
					<view class="" style="font-size: 28rpx;">
						{{item.name}}
					</view>
					<view class="" style="font-size: 26rpx; margin-top: 20rpx; white-space:nowrap;">
						<u-icon name="map" color="#717171" size="26"></u-icon> 成都市金牛区万达广场
					</view>
				</view>
				<!-- <view class="box-fright">
					<view class="">
						55m
					</view>
				</view> -->
			<!-- </view> -->
		</view>
		
	</view>
</template>

<script>

	export default {
		components: {
		},
		data() {
			return {
				keyword: '',
				title: '场地资料',
				list: [],
			}
		},
		onLoad(e) {
		},
		onShow() {
			this.getList()
		},
		methods: {
			async getList() {
				const res = await this.$u.post('api/hotel.Index/index')
				this.list = res.data
			},
		}
	}
</script>

<style lang="scss" scoped>
	.conter {
		width: 100%;
		height: 100%;
		padding: 0 30rpx;
		background-color: #FFFFFF;
		
		image {
			width: 100%;
			height: 100%;
		}
		
		.conter-box1 {
			height: 170rpx;
			margin-top: 20rpx;
			border-bottom: 1rpx solid #EFEFEF;
			
			.conter-box-image {
				width: 152rpx;
				height: 130rpx;
				margin-right: 20rpx;
			}
			
			/deep/.box-fright {
				margin-left: 20rpx !important;
				// display: flex;
				// justify-content: space-between !important;
			}
		}
		
	}
</style>
